<template>
    <div class="dueToday">
        <AreaTitleWarp :title="'筛选条件'"></AreaTitleWarp>
        <AreaWarp :padding="true">
	        <SearchWarp :label="'姓名'">
	        	<el-input v-model.trim="searchInfo.realName"    placeholder="请输入用户姓名"></el-input>
	        </SearchWarp>
	        <SearchWarp :label="'手机号'">
	          <el-input v-model.trim="searchInfo.mobile" maxlength="11" placeholder="请输入手机号码"></el-input>
	        </SearchWarp>
            <SearchWarp :label="'待还款金额'">
	          <el-input class="inputWidth" v-model.trim="searchInfo.paidAmountStart"  placeholder="起始金额"></el-input>
	          -
	          <el-input class="inputWidth" v-model.trim="searchInfo.paidAmountEnd"  placeholder="结束金额"></el-input>
	        </SearchWarp>
            <SearchWarp :label="'本人是否接通'">
		        <el-select v-model="searchInfo.isCall"  placeholder="请选择">
		          <el-option v-for="item in isCallOptions"
		                     :key="item.value"
		                     :label="item.label"
		                     :value="item.value">
		          </el-option>
		        </el-select>
		    </SearchWarp>
            <SearchWarp :label="'联系人数'">
	          <el-input class="inputWidth" v-model.trim="searchInfo.callNumStart"  placeholder="起始人数"></el-input>
	          -
	          <el-input class="inputWidth" v-model.trim="searchInfo.callNumEnd"  placeholder="结束人数"></el-input>
	        </SearchWarp>
            <SearchWarp :label="'愿意转告人数'">
	          <el-input class="inputWidth" v-model.trim="searchInfo.tellNumStart"  placeholder="起始人数"></el-input>
	          -
	          <el-input class="inputWidth" v-model.trim="searchInfo.tellNumEnd"  placeholder="结束人数"></el-input>
	        </SearchWarp>
            <SearchWarp :label="'提醒人'">
		        <el-select v-model="searchInfo.remindName"  placeholder="请选择">
		          <el-option v-for="item in remindPeopleOptions"
		                     :key="item.value"
		                     :label="item.label"
		                     :value="item.label">
		          </el-option>
		        </el-select>
		    </SearchWarp>
	        <BtnWarp>
	          <el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
	          <el-button type="info" icon="el-icon-delete" @click="reset">重置</el-button>
	        </BtnWarp>
	    </AreaWarp>


        <AreaTitleWarp :title="'订单列表'"></AreaTitleWarp>
        <!--搜索结果区域-->
      <AreaWarp :padding="false">
        <el-table :data="tableInfo.list" style="width: 100%" class="pub-table" header-row-class-name="pub-table-header-row" header-cell-class-name="pub-table-header-cell"
          tooltip-effect="dark"   
        >

            <el-table-column prop="userId" label="提醒" min-width="120">
                <template slot-scope="scope">
                    <el-button type="text" size="small" @click="dblclick(scope.row)">提醒</el-button>
                </template>
            </el-table-column>
            <el-table-column prop="borrowId" label="订单ID" min-width="120"></el-table-column>
            <el-table-column prop="realName" label="姓名" min-width="120"></el-table-column>
            <el-table-column prop="mobile" label="手机号" min-width="120"></el-table-column>
            <el-table-column prop="paidAmount" label="待还款金额" min-width="120"></el-table-column>
            <el-table-column prop="isCall" label="本人是否接通" min-width="120" :formatter="formatter_iscall"></el-table-column>
            <el-table-column prop="repayWish" label="本人还款意愿" min-width="120" :formatter="formatter_repayWish"></el-table-column>
            <el-table-column prop="callNum" label="联系人数" min-width="120"></el-table-column>
            <el-table-column prop="wishCallNum" label="愿转告人数" min-width="120"></el-table-column>
            <el-table-column prop="lastRemindTime" label="最近提醒时间" min-width="180" :formatter="formatter_timeYMDHM"></el-table-column>
            <el-table-column prop="remindName" label="提醒人" min-width="120"></el-table-column>
        </el-table>
        <el-pagination
          layout="total,sizes,prev, pager, next, jumper" class="pub-page"
          :current-page="searchInfo.page"
          :page-sizes="[20,50,100]"
          :page-size="searchInfo.size"
          :total="tableInfo.total"
          @current-change="search"
          @size-change="handleSizeChange"
        >
        </el-pagination>
      </AreaWarp>
    </div>
</template>
<script>
    import Warn from '../../../assets/js/warn.js'
    export default {
        data(){
            return{
                searchInfo:{
                    realName: '',
                    mobile: '',
                    paidAmountStart:'',
                    paidAmountEnd:'',
                    isCall:-1,
                    callNumStart:'',
                    callNumEnd:'',
                    tellNumStart:'',
                    tellNumEnd:'',
                    remindName:'全部',
                    size:50,
					page:1, 
                },
                isCallOptions:[
                    {
                        value: -1,
                        label:"全部"
                    },
                    {
                        value: 1,
                        label:"是"
                    },
                    {
                        value: "0",
                        label:"否"
                    }
                ],
                remindPeopleOptions:[
                    {
                        value: -1,
                        label:"全部"
                    }
                ],
                loading:false,
                tableInfo:{
                    list:[],
                    total:0
                }
            }
        },
        methods:{
            handleSizeChange(val){
                let that = this;
				that.searchInfo.size = val;
            	that.searchInfo.page = 1;
            	that.search()
            },
            //提醒人
            remindId(){
                let that = this;
                let login_user = that.localData('get','login_user');
                let role = login_user.role;
                let companyId = login_user.companyId;
				return new Promise(function(resolve,reject){
					that.ajaxJson({
                        url: '/custom/customUsers',
                        data:{
                            role:role,
                            companyId:companyId
                        },
			            success: function (res) {
                            console.log(res.data,'提醒人')
				            if (res.code == '0') {			            	
				            	let data = res.data;
				            	data.forEach(function(item){
				            		that.remindPeopleOptions.push({
				            			value: item.id,
	          							label: item.realName
				            		})

				            	})
				            	resolve()
				            }
				         }
			        })	
				})
            },
            search(currentPage){
                let that = this;
				that.searchInfo.page = typeof currentPage == 'number' ? currentPage : 1;
				let x = {
					realName: that.searchInfo.realName,
                    mobile: that.searchInfo.mobile,
                    paidAmountStart:that.searchInfo.paidAmountStart,
                    paidAmountEnd:that.searchInfo.paidAmountEnd,
                    isCall:that.searchInfo.isCall,
                    callNumStart:that.searchInfo.callNumStart,
                    callNumEnd:that.searchInfo.callNumEnd,
                    tellNumStart:that.searchInfo.tellNumStart,
                    tellNumEnd:that.searchInfo.tellNumEnd,
                    remindName:that.searchInfo.remindName,
					size: that.searchInfo.size,
					page: that.searchInfo.page,
				}
				let warn = new Warn(x)
				let reqData = warn.getState()
				if(reqData.code){
					that.showMsg(reqData.message,'error')
					return 
				}
				that.loading = true;
				that.ajaxJson({
		          url: '/custom/list',
		          data: reqData,
		          success: function (res) {
                      console.log(res.data,'***************')
		            if (res.code == '0') {
		            	that.tableInfo = res.data;
		            }
		            that.loading = false;
		          }
		        })
            },
            reset(){
				let that = this;
				that.searchInfo = {
					realName: '',
                    mobile: '',
                    paidAmountStart:'',
                    paidAmountEnd:'',
                    isCall:'',
                    callNumStart:'',
                    callNumEnd:'',
                    tellNumStart:'',
                    tellNumEnd:'',
                    remindName:'',
					size:50,
					page:1,
                }
                that.tableInfo ={
                    list:[],
                    total:0
                }
				that.search();
            },
            //提醒
            dblclick(row){
                let that = this;
                that.$emit('addTab', {
                  tabOptions: 'dueMessage_'+ row.realName+'-'+row.borrowId+'-案件详情',
                  queryMsg: { method: 'add',borrowId:row.borrowId,userId:row.userId}
                })
            }
            
        },
        created(){
            let that = this;
            Promise.all([
				that.remindId()
			]).then(arr=>{
				that.search();
			})
        }
    }
</script>
<style lang="less">
    .dueToday{
		.inputWidth{
			width:120px;
		}
	}
</style>
